<template>
    <div class="features">
        <div class="banner">
           <img src="../assets/img/featureBanner.png">
        </div>
        <nav>
            <div class="nav_title">
               <img src="../assets/img/app_1.png">
               <span>{{$t('contact.downLoad')}}</span>
            </div>
            <img class="app" src="../assets/img/app.png">
<!--             <span>{{$t('contact.downLoad')}}</span> -->
        </nav>
        <div class="downLoad">
            <ul class="downBox">
                <li>
                    <a href="https://apps.apple.com/us/app/wenno/id1071091237?ls=1"><img src="../assets/img/apple_en.png"></a>
                </li>
                <li>
                    <a href="https://play.google.com/store/apps/details?id=com.wennoanimal.wenno"><img src="../assets/img/goole_en.png"></a>
                </li>
                <li>
                    <a href="https://appgallery.cloud.huawei.com/uowap/index.html#/detailApp/C100606435?source=appshare&subsource=C100606435&shareTo=weixin&locale=zh_CN"><img src="../assets/img/huawei_en.png"></a>
                </li>
                <li>
                    <a href="https://www.wennoanimal.com/uploads/download/Wenno.apk"><img src="../assets/img/browser_en.png"></a>
                </li>
            </ul>
        </div>
        <div class="video">
            <div class="videoBox">
                <video poster="../assets/img/stape.png" id="videoid"  controls="controls">
                  <source  src="" type="video/mp4" />
                         你的浏览器不支持H5播放器
                </video>                
            </div>
        </div>
        <div class="appPhoto">
            <p>{{$t('contact.wetich')}}</p>
            <div class="appBox">
               <div>
                  <img src="../assets/img/sweep_1.png">
               </div>
               <div>
                  <img src="../assets/img/sweep_2.png">
               </div>
               <div>
                   <img src="../assets/img/sweep_scan.png">
                   <span class="appListButton">{{$t('contact.sweepCode')}}</span>
               </div>
            </div>
        </div>
        <div class="joinUs">
            <div class="joinBox">
               <div class="joinTitle">
                  <p>{{$t('contact.joinUs')}}</p>
                  <span>{{$t('contact.contest')}}</span>
               </div>
            </div>
            <div class="joinList">
               <div>
                  <img src="../assets/img/sweep_3.png">
               </div>
               <div>
                  <img src="../assets/img/sweep_4.png">
               </div>
               <div>
                  <img src="../assets/img/sweep_5.png">
               </div>
            </div>
        </div>
    </div>
</template>
<script>
export default {
  name: "features",
  data () {
    return {
        name:'我要测试首页'
    }
  },
  mounted:function(){ 
       window.scrollTo(0, 0);
  },
  methods: {
      dataRender () {
          $.ajax({
                url:'https://www.bunchparty.com/GetPlayInfo/wenno.php',
                type: 'GET',
                dataType: 'json',
                success:function(data){
                    console.log(JSON.stringify(data));
                    console.log(data.url);
                    document.getElementById("videoid").src=data.url ;  
                    document.getElementById("videoid").play(); 

                },
                error:function(XMLHttpRequest, textStatus, errorThrown) {
                    console.log(XMLHttpRequest.status);
                    console.log(XMLHttpRequest.readyState);
                    console.log(textStatus);
                }
            });
      }
  },
  created:function () {
     this.dataRender();
  }
};
</script>
<style scoped>
@import "../assets/css/featureList.css";
</style>